<%@ page language="java" contentType="text/html; charset=utf-8"
	pageEncoding="utf-8"%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<c:set var="path" value="${pageContext.request.contextPath }"></c:set>
<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>hhm管理-设备监控视图</title>
    <link href="${path}/css/style.css" rel="stylesheet" type="text/css">
    <link href="${path}/common/plugins/bootstrap/css/bootstrap.css" rel="stylesheet" type="text/css">
    <link href="${path}/common/plugins/MyDate97/skin/WdatePicker.css" rel="stylesheet" type="text/css">
    <script src="${path}/js/jquery-1.7.2.min.js" type="text/javascript"></script>
    <script src="${path}/common/plugins/zTree/jquery.ztree.core-3.5.min.js"></script>
    <script src="${path}/common/plugins/handlebars.js" type="text/javascript"></script>
    <script src="${path}/common/plugins/bootstrap/js/bootstrap.js" type="text/javascript"></script>
    <script src="${path}/common/plugins/MyDate97/WdatePicker.js"></script>
    <script src="${path }/common/plugins/echarts3/echarts.min.js"></script>
    <script src="${path}/common/plugins/layer/layer.js"></script>
    <script src="${path}/js/common.js" type="text/javascript"></script>
    <script src="${path}/js/user_js.js" type="text/javascript"></script>

    <style>
        html,body {margin:0;padding:0;}
        body{background:#f1f1f1;height:100%;}
        .content{
            padding-bottom: 40px;
        }
        .capacity_list{float:left;width:49%;border:1px solid #d5d5d5;height:auto;}
        .canvas_list{height: 300px; width:440px;float:left;}
        .graph_select{position:relative;display: block}
        .graph_select ul{position:absolute;right:0px;top:25px;margin:0!important;background:#fff;border:1px solid #d5d5d5;z-index: 9999;padding:5px 8px;display: none;width:auto;}
        .graph_select ul li{width:auto;min-width:50px;white-space: nowrap;cursor:pointer;padding:2px 3px}
        .graph_select ul li:hover{background:#f1f1f1;}
        .capacity_list:hover .graph_select{display: block}
        .selectlist{display: inline-block;cursor: pointer;line-height:25px;}
        .down{float:right;background-position:-158px -16px;margin-top:3px;}
        .content_details{padding-bottom: 40px;}
    </style>
    <script type="text/javascript">
        var webPath = "${path}";
    </script>
</head>
<body>
<input id="webPath" type="hidden" value="${path}">
<div class="content_details">
    <div class="content_l span2">
        <div class="control-title">
            <i class="business content_current"></i><span>业务系统</span>
        </div>
        <div class="well">
            <!--树div-->
            <jsp:include page="/common/jsp/ztree.jsp" />
        </div>
    </div>

    <div class="content_r span10">
        <div class="content_group">
            <div class="span3">
                <label class="control-label">日期:&nbsp;&nbsp;从</label>
                <div class="controls">
                    <input id="startTime" type="text" class="Wdate" onFocus="WdatePicker({dateFmt:'yyyy-MM-dd HH:mm:ss',maxDate:'#F{$dp.$D(\'endTime\',{d:-1})}'})"/>
                </div>
            </div>
            <div class="span3">
                <label class="control-label">至:</label>
                <div class="controls">
                    <input id="endTime" type="text" class="Wdate" onFocus="WdatePicker({dateFmt:'yyyy-MM-dd HH:mm:ss',minDate:'#F{$dp.$D(\'startTime\',{d:0})}'})"/>
                </div>
            </div>
            <div class="centerbtn">
                <button style="" class="press_btn1"><i class="search top_current"></i>查询</button>
            </div>
        </div>
        <div class="control-title">
            <i class="list content_current"></i><span>资源列表</span>
        </div>
        <div class="content_table">
            <div>
                <!-- Nav tabs -->
                <ul class="nav nav-tabs" role="tablist">
                    <li role="presentation" class="active">
                        <a href="#home" aria-controls="home" role="tab" data-toggle="tab">概要信息</a>
                    </li>
                    <li role="presentation">
                        <a href="#perf" aria-controls="perf" role="tab" data-toggle="tab">性能</a>
                    </li>
                    <li role="presentation">
                        <a href="#capac" aria-controls="capac" role="tab" data-toggle="tab">容量</a>
                    </li>
                    <li role="presentation">
                        <a href="#process" aria-controls="process" role="tab" data-toggle="tab">进程</a>
                    </li>
                    <li role="presentation">
                        <a href="#servicestatus" aria-controls="servicestatus" role="tab" data-toggle="tab">服务</a>
                    </li>
                    <li role="presentation">
                        <a href="#status" aria-controls="status" role="tab" data-toggle="tab">部件状态</a>
                    </li>
                    <li role="presentation">
                        <a href="#db" aria-controls="status" role="tab" data-toggle="tab">数据库</a>
                    </li>
                </ul>
                <!-- Tab panes -->
                <div class="tab-content">
                    <div role="tabpanel" class="tab-pane active" id="home">
                        概要信息
                    </div>
                    <div role="tabpanel" class="tab-pane" id="perf">

                    </div>
                    <div role="tabpanel" class="tab-pane" id="capac">

                    </div>
                    <div role="tabpanel" class="tab-pane" id="process">
                        <table class="table table-striped table-bordered table-hover table-ellipsis details">
                            <thead>
                            <tr>
                                <th>进程ID</th>
                                <th>父进程ID</th>
                                <th>进程名称</th>
                                <th>进程占用内存百分比</th>
                            </tr>
                            </thead>
                            <tbody>

                            </tbody>
                        </table>
                    </div>

                    <div role="tabpanel" class="tab-pane" id="servicestatus">

                    </div>

                    <div role="tabpanel" class="tab-pane" id="status">

                    </div>
                    <div role="tabpanel" class="tab-pane" id="db">

                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
</body>
<script src="${path }/common/plugins/jquery-column.js"></script>
<script src="js/view_menu.js"></script>
</html>